<template>
    <div >
        <click-list>
            <click-item :isShow="false" class="member-name item">
                 <img src="@/assets/images/base-images/-xingming.png" alt="" slot="icon">
                <span slot="text">姓名</span>
                <input  type="text" placeholder="请输入学员姓名" slot="ipt" v-model="memberList.name">
            </click-item>
            <click-item :isShow="false" class="member-sex">
                 <img src="@/assets/images/base-images/xingbie.png" alt="" slot="icon">
                <span slot="text">性别</span>
                <div slot="ipt" class="opt" ref="sexopt">
                    <label for="man">男</label>
                    <input  type="radio" value="0" name="sex" id="man"  required="required" v-model="memberList.sex">
                    <label for="woman">女</label>
                    <input  type="radio" value="1" name="sex" id="woman" required="required" v-model="memberList.sex">
                </div>
            </click-item>
            <click-item :isShow="false" class="member-date item">
                 <img src="@/assets/images/base-images/出生日期.png" alt="" slot="icon">
                <span slot="text">出生日期</span>
                <input  type="date" placeholder="点击设置" slot="ipt" v-model="memberList.birthday">
            </click-item>
            <click-item :isShow="false" class="member-phone item">
                 <img src="@/assets/images/base-images/shouji.png" alt="" slot="icon">
                <span slot="text">联系电话</span>
                <input  type="text" placeholder="请输入学员联系电话" slot="ipt" maxlength="11" v-model="memberList.phone">
            </click-item>
            <click-item :isShow="false" class="member-symptom item">
                 <img src="@/assets/images/base-images/主述症状.png" alt="" slot="icon">
                <span slot="text">主要症状</span>
                <input  type="text" placeholder="(10字以内)" slot="ipt" maxlength="10" v-model="memberList.niledinut">
            </click-item>
            <click-item :isShow="false" class="member-description item">
                 <img src="@/assets/images/base-images/问题描述.png" alt="" slot="icon">
                <span slot="text">问题描述</span>
            </click-item>
            <div class="textarea"><textarea  type="text" placeholder="请输入学员详细问题" v-model="memberList.description"></textarea></div>
            <!-- {{memberList}} -->
        </click-list>
    </div>
</template>

<script>
    import ClickList from '@/components/clickitem/ClickList';
    import ClickItem from '@/components/clickitem/ClickItem';
    export default {
        name:'AddMembersMain',
       props: {
           memberList: {
               type: Object,
               default(){
                   return 
               }
           },
       },
        components: {
            ClickList,
            ClickItem
        },
        methods: {
            
        },
    }
</script>

<style scoped>
    .item input{
    position: absolute;
    outline: none;
    border: none;
    text-align: right;
    right: 30px;
    top: 15px;
}
.member-sex .opt{
 position: absolute;
 right: 30px;
}
.member-description{
    border: none;
}
.textarea textarea{
    border: none;
    width: 322px;
    height: 100px;
    outline: none;
    border: 1px solid #e8e9ee;
    border-radius: 5px;
    margin-left: 25px;
    resize:none;
}
</style>